<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt"  prefix="fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>系统管理后台</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8" />
    <link href="${pageContext.request.contextPath}/static/admin/assets/css/vendor/bootstrap/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/admin/css/font-awesome.css" rel="stylesheet">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/css/vendor/animate/animate.min.css">
    <link type="text/css" rel="stylesheet" media="all" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/mmenu/css/jquery.mmenu.all.css" />
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/videobackground/css/jquery.videobackground.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/css/vendor/bootstrap-checkbox.css">

    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/rickshaw/css/rickshaw.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/morris/css/morris.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/tabdrop/css/tabdrop.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/summernote/css/summernote.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/summernote/css/summernote-bs3.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/chosen/css/chosen.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/admin/assets/js/vendor/chosen/css/chosen-bootstrap.css">

    <link href="${pageContext.request.contextPath}/static/admin/assets/css/minimal.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/admin/css/sweetalert.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/admin/css/company.css" rel="stylesheet">

    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <style>
        td a{
            color:#ffffff;
        }
        td a:hover{
            color: #999999;
            text-decoration: none;
        }
        .refresh i{
            padding:5px;
        }
    </style>
</head>
<body class="bg-1">



<!-- Preloader -->
<div class="mask"><div id="loader"></div></div>
<!--/Preloader -->

<!-- Wrap all page content here -->
<div id="wrap">




    <!-- Make page fluid -->
    <div class="row">





        <!-- Fixed navbar -->
        <div class="navbar navbar-default navbar-fixed-top navbar-transparent-black mm-fixed-top" role="navigation" id="navbar">



            <!-- Branding -->
            <div class="navbar-header col-md-2">
                <a class="navbar-brand" href="index.html">
                    <strong>Shakes</strong>Beare
                </a>
                <div class="sidebar-collapse">
                    <a href="#">
                        <i class="fa fa-bars" style="line-height: 45px"></i>
                    </a>
                </div>
            </div>
            <!-- .nav-collapse -->
            <div class="navbar-collapse">
                <!-- Quick Actions -->
                <ul class="nav navbar-nav quick-actions">
                    <li class="dropdown divided">

                        <a class="dropdown-toggle button" data-toggle="dropdown" href="#">
                            <i class="fa fa-envelope"></i>
                            <span class="label label-transparent-black">1</span>
                        </a>

                        <ul class="dropdown-menu wider arrow nopadding messages">
                            <li><h1>You have <strong>1</strong> new message</h1></li>
                            <li>
                                <a class="cyan" href="#">
                                    <div class="profile-photo">
                                        <img src="${pageContext.request.contextPath}/static/admin/assets/images/ici-avatar.jpg" alt />
                                    </div>
                                    <div class="message-info">
                                        <span class="sender">Ing. Imrich Kamarel</span>
                                        <span class="time">12 mins</span>
                                        <div class="message-content">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</div>
                                    </div>
                                </a>
                            </li>

                            <li>
                                <a class="green" href="#">
                                    <div class="profile-photo">
                                        <img src="${pageContext.request.contextPath}/static/admin/assets/images/arnold-avatar.jpg" alt />
                                    </div>
                                    <div class="message-info">
                                        <span class="sender">Arnold Karlsberg</span>
                                        <span class="time">1 hour</span>
                                        <div class="message-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit</div>
                                    </div>
                                </a>
                            </li>

                            <li>
                                <a href="#">
                                    <div class="profile-photo">
                                        <img src="${pageContext.request.contextPath}/static/admin/assets/images/face.jpeg" alt />
                                    </div>
                                    <div class="message-info">
                                        <span class="sender">John Douey</span>
                                        <span class="time">3 hours</span>
                                        <div class="message-content">Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia</div>
                                    </div>
                                </a>
                            </li>

                            <li>
                                <a class="red" href="#">
                                    <div class="profile-photo">
                                        <img src="${pageContext.request.contextPath}/static/admin/assets/images/peter-avatar.jpg" alt />
                                    </div>
                                    <div class="message-info">
                                        <span class="sender">Peter Kay</span>
                                        <span class="time">5 hours</span>
                                        <div class="message-content">Ut enim ad minim veniam, quis nostrud exercitation</div>
                                    </div>
                                </a>
                            </li>

                            <li>
                                <a class="orange" href="#">
                                    <div class="profile-photo">
                                        <img src="${pageContext.request.contextPath}/static/admin/assets/images/george-avatar.jpg" alt />
                                    </div>
                                    <div class="message-info">
                                        <span class="sender">George McCain</span>
                                        <span class="time">6 hours</span>
                                        <div class="message-content">Lorem ipsum dolor sit amet, consectetur adipisicing elit</div>
                                    </div>
                                </a>
                            </li>


                            <li class="topborder"><a href="#">Check all messages <i class="fa fa-angle-right"></i></a></li>
                        </ul>

                    </li>
                    <li class="dropdown divided user" id="current-user">
                        <div class="profile-photo">
                            <img src="${pageContext.request.contextPath}/static/admin/assets/images/face.jpeg" alt />
                        </div>
                        <a class="dropdown-toggle options" data-toggle="dropdown" href="#">
                            管理员 <i class="fa fa-caret-down"></i>
                        </a>

                        <ul class="dropdown-menu arrow settings">

                            <li>

                                <h3>Backgrounds:</h3>
                                <ul id="color-schemes">
                                    <li><a href="#" class="bg-1"></a></li>
                                    <li><a href="#" class="bg-2"></a></li>
                                    <li><a href="#" class="bg-3"></a></li>
                                    <li><a href="#" class="bg-4"></a></li>
                                    <li><a href="#" class="bg-5"></a></li>
                                    <li><a href="#" class="bg-6"></a></li>
                                </ul>

                                <div class="form-group videobg-check">
                                    <div class="col-xs-4 control-label">
                                        <div class="onoffswitch greensea small">
                                            <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="videobg-check">
                                        </div>
                                    </div>
                                </div>

                            </li>
                            <li class="divider"></li>
                            <li>
                                <a href="${pageContext.request.contextPath }/admin/setting/index.action"><i class="fa fa-user"></i>修改密码</a>
                            </li>
                            <li>
                                <a href="${pageContext.request.contextPath }/admin/logout.action"><i class="fa fa-power-off"></i> Logout</a>
                            </li>
                            <li></li>

                        </ul>
                    </li>


                </ul>
                <!-- /Quick Actions -->



                <!-- Sidebar -->
                <ul class="nav navbar-nav side-nav" id="sidebar">

                    <li class="collapsed-content">
                        <ul>
                            <li class="search"><!-- Collapsed search pasting here at 768px --></li>
                        </ul>
                    </li>

                    <li class="navigation" id="navigation">
                        <a href="#" class="sidebar-toggle" data-toggle="#navigation">Navigation <i class="fa fa-angle-up"></i></a>

                        <ul class="menu">

                            <li>
                                <a href="${pageContext.request.contextPath }/admin/index/index.action">
                                    <i class="fa fa-tachometer"></i> 概况
                                    <span class="badge badge-red"></span>
                                </a>
                            </li>
                            <li>
                                <a href="${pageContext.request.contextPath}/admin/ad/index.action">
                                    <i class="fa fa-tint"></i> 广告管理
                                </a>
                            </li>
                            <li class="dropdown open active">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                    <i class="fa fa-th-large"></i> 用户管理 <b class="fa fa-plus dropdown-plus"></b>
                                </a>
                                <ul class="dropdown-menu">
                                    <li class="active">
                                        <a href="${pageContext.request.contextPath}/admin/customer/index.action">
                                            <i class="fa fa-caret-right"></i> 用户管理
                                        </a>
                                    </li>
                                    <li>
                                        <a href="${pageContext.request.contextPath}/admin/customer/resumeIndex.action">
                                            <i class="fa fa-caret-right"></i> 简历管理
                                        </a>
                                    </li>
                                </ul>
                            </li>

                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                    <i class="fa fa-th-large"></i> 企业管理 <b class="fa fa-plus dropdown-plus"></b>
                                </a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="${pageContext.request.contextPath }/admin/company/index.action">
                                            <i class="fa fa-caret-right"></i> 企业用户账号
                                        </a>
                                    </li>
                                    <li>
                                        <a href="${pageContext.request.contextPath }/admin/company/verify.action">
                                            <i class="fa fa-caret-right"></i> 企业账号审核
                                        </a>
                                    </li>
                                </ul>
                            </li>

                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                    <i class="fa fa-child"></i> 职位管理 <b class="fa fa-plus dropdown-plus"></b>
                                </a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="${pageContext.request.contextPath }/admin/job/index.action">
                                            <i class="fa fa-caret-right"></i> 职位列表
                                        </a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                </ul>
                <!-- Sidebar end -->





            </div>
            <!--/.nav-collapse -->





        </div>
        <!-- Fixed navbar end -->






        <!-- Page content -->
        <div id="content" class="col-md-12">









            <!-- page header -->
            <div class="pageheader">
                <h2><i class="fa fa-th-large"></i> 用户管理
                </h2>
            </div>
            <!-- /page header -->






            <!-- content main container -->

            <div class="main">
                <!--具体功能框架写在这里-->
                <section class="tile color transparent-black">



                    <!-- tile header -->
                    <div class="tile-header">
                        <h1><strong>Customer</strong> Table</h1>
                        <div class="search">
                            <input type="text" placeholder="用户名..." id="fullname">
                        </div>
                        <div class="controls">
                            <a href="#" class="refresh"><i class="fa fa-refresh" onclick="fetchData()"></i></a>
                            <a href="#" class="remove"><i class="fa fa-times"></i></a>
                        </div>
                    </div>
                    <!-- /tile header -->

                    <!-- tile widget -->
                    <div class="tile-widget bg-transparent-black-2">
                        <div class="row">

                            <div class="col-sm-8 col-xs-6 text-right col-sm-offset-4">

                            </div>


                        </div>
                    </div>
                    <!-- /tile widget -->



                    <!-- tile body -->
                    <div class="tile-body nopadding">

                        <table class="table table-bordered table-sortable" id="table_customer">
                            <thead>
                            <tr>
                                <th style="width: 60px">
                                    <div class="checkbox check-transparent">
                                        <input type="checkbox" value="1" id="allchck">
                                        <label for="allchck"></label>
                                    </div>
                                </th>
                                <th class="sortable sort-alpha">用户名</th>
                                <th class="sortable sort-alpha">性别</th>
                                <th class="sortable sort-alpha">手机号码</th>
                                <th class="sortable sort-alpha">邮箱地址</th>
                                <th class="sortable sort-alpha">创建日期</th>
                                <th class="sortable sort-alpha">状态</th>
                                <th class="sortable sort-alpha">操作</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>

                    </div>
                    <!-- /tile body -->


                    <!-- tile footer -->
                    <div class="tile-footer bg-transparent-black-2 rounded-bottom-corners">
                        <div class="row">

                            <div class="col-sm-4">
                                <button type="button" class="btn btn-default btn-xs margin-bottom-20" onclick="delete_confirm()">删除</button>
                            </div>

                            <div class="col-sm-4 text-center">
                                <small class="inline table-options paging-info"></small>
                            </div>

                            <div class="col-sm-4 text-right sm-center">
                                <ul class="pagination pagination-xs nomargin pagination-custom">

                                </ul>
                            </div>

                        </div>
                    </div>
                    <!-- /tile footer -->




                </section>
            </div>
            <!-- /content container -->

        </div>
        <!-- Page content end -->


    </div>
    <!-- Make page fluid-->




</div>
<!-- Wrap all page content end -->



<section class="videocontent" id="video"></section>
<table id="table_td_temp" style="display:none">
    <tbody id="template-list-tbody">
    <tr>
        <td>
            <div class="checkbox check-transparent">
                <input type="checkbox" value="" id="">
                <label for=""></label>
            </div>
        </td>
        <td class="fullname">Jacob</td>
        <td class="sex">Thornton</td>
        <td class="telephone">@fat</td>
        <td  class="email">@fat</td>
        <td class="date_added">@fate</td>
        <td class="status">@da</td>
        <td>
            <a href="" class="check-toggler delete_customer">删除&nbsp;</a>
            <a href="" class="customer_detail">查看详情&nbsp;</a>
            <a href="" class="lock">封号</a>
        </td>
    </tr>
    </tbody>
</table>


<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="${pageContext.request.contextPath}/static/admin/assets/js/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/bootstrap/bootstrap.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/mmenu/js/jquery.mmenu.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/sparkline/jquery.sparkline.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/nicescroll/jquery.nicescroll.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/animate-numbers/jquery.animateNumbers.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/videobackground/jquery.videobackground.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/blockui/jquery.blockUI.js"></script>

<script src="${pageContext.request.contextPath}/static/admin/assets/js/vendor/chosen/chosen.jquery.min.js"></script>

<script src="${pageContext.request.contextPath}/static/admin/assets/js/minimal.min.js"></script>
<script src="${pageContext.request.contextPath}/static/admin/js/page.js"></script>
<script src="${pageContext.request.contextPath}/static/admin/js/sweetalert.min.js"></script>

<script>
    var show = "";
    var fetchData = function (furl) {
        if(furl==null) {
            url = "${pageContext.request.contextPath}/admin/customer/getCustomerList.action?p=1";
        }else{
            url = furl;
        }
        var fullname = $('#fullname').val();
        console.log(fullname);
        $.ajax({
            type:'get',
            url:url,
            data:'fullname='+fullname,
            success:function(json){
                console.log(json);
                show = json.show;
                if (show=="" ||show.totalRows == 0) {
                    $(".main table tbody").html('<tr><td colspan="8" align="center">暂无记录</td></tr>');
                    $('.paging-info').html("showing 0-0 of 0 items");
                    $('.pagination').html("");
                    return;
                } else {
                    var list = json.data;
                    var body = $(".main table tbody");
                    var temp_body = $('#template-list-tbody');
                    var tds = $('#table_td_temp td');
                    var string = "";
                    for (var i in list) {
                        $("#table_td_temp input").val(list[i].customer_id);
                        $("#table_td_temp input").attr("id", "chck" + list[i].customer_id);
                        $("#table_td_temp label").attr("for", "chck" + list[i].customer_id);
                        $("#table_td_temp .delete_customer").attr("href","javascript:delete_confirm("+list[i].customer_id+")");
                        $("#table_td_temp .lock").attr("href","javascript:updateStatus("+list[i].customer_id+","+list[i].status+")");
                        $('#table_td_temp .customer_detail').attr("href","${pageContext.request.contextPath}/admin/customer/detail.action?customer_id="+list[i].customer_id);
                        tds[1].innerHTML = list[i].fullname;
                        tds[2].innerHTML = list[i].sex == 'M' ? "男" : "女";
                        tds[3].innerHTML = list[i].telephone;
                        tds[4].innerHTML = list[i].email;
                        if(list[i].date_added != null) {
                            var date = new Date(list[i].date_added);
                            console.log(date.toDateString());
                            var year = date.getFullYear();
                            var month = date.getMonth()+1;
                            var day = date.getDate();
                            tds[5].innerHTML = year+"-"+month+"-"+day;
                        }else {
                            tds[5].innerHTML = list[i].date_added;
                        }
                        if(list[i].status == 1){
                            tds[6].innerHTML = "正常";
                            $("#table_td_temp .lock").html("封号");
                        }else {
                            tds[6].innerHTML = "已封号";
                            $("#table_td_temp .lock").html("解封");
                        }
                        string += temp_body.html();
                    }
                    body.html(string);
                    if(show.currentPage == show.totalPage){
                        $('.paging-info').html("showing "+(show.startIndex+1)+"-"+show.totalRows+" of "+show.totalRows+" items");
                    }else {
                        $('.paging-info').html("showing "+(show.startIndex+1)+"-"+show.endIndex+" of "+show.totalRows+" items");
                    }
                    make_page(show,'.pagination','?');
                }
            }
        });
    }

    fetchData();

    $(function(){

        //check all checkboxes
        $('table thead input[type="checkbox"]').change(function () {
            $(this).parents('table').find('tbody input[type="checkbox"]').prop('checked', $(this).prop('checked'));
        });

        // sortable table
//        $('.table.table-sortable th.sortable').click(function() {
//            var o = $(this).hasClass('sort-asc') ? 'sort-desc' : 'sort-asc';
//            $(this).parents('table').find('th.sortable').removeClass('sort-asc').removeClass('sort-desc');
//            $(this).addClass(o);
//        });

        //chosen select input
        $(".chosen-select").chosen({disable_search_threshold: 10});

        //check toggling
//        $('.check-toggler').on('click', function(){
//            $(this).toggleClass('checked');
//        })

    });

    function delete_confirm(id){
        var ids = new Array();
        if(id==null) {
            var selected = $('#table_customer tbody input:checkbox:checked');
            if(selected.length == 0){
                swal("", "请选择要删除的用户！", "error");
                return;
            }
            for (var i = 0; i < selected.length; i++) {
                ids[i] = selected[i].value;
            }
        }else{
            ids[0]=id;
        }
        var ids_arr = {"ids":ids};
        swal({
            title: "",
            text: "确认删除？",
            type: "warning",
            showCancelButton: true,
            closeOnConfirm: true,
            confirmButtonText: "确定",
            confirmButtonColor: "#ec6c62"
        }, function() {
            deleteCustomers(ids_arr);
        });
    }

    function deleteCustomers(ids){

        $.ajax({
            url:"${pageContext.request.contextPath}/admin/customer/deleteCustomers.action",
            type:'post',
            contentType:'application/json;charset=utf-8',
            data:JSON.stringify(ids),
            success:function(json){
                if(json != 1){
                    swal("", "删除错误！", "error");
                }else{
                    swal("", "删除成功！", "success");
                }
                if(show.totalRows!=0) {
                    fetchData("${pageContext.request.contextPath}/admin/customer/getCustomerList.action?p="+show.currentPage);
                }
                if($('table thead input[type="checkbox"]').prop('checked')){
                    $('table thead input[type="checkbox"]').prop('checked', false);
                }
            }
        });
    }

    function updateStatus(customer_id,status){
        if(status == 1){
            status = 0;
        }else if(status == 0){
            status = 1;
        }else{
            status = 0;
        }
        $.ajax({
            url: "${pageContext.request.contextPath}/admin/customer/updateCustomerStatus.action",
            type:'post',
            data:'customer_id='+customer_id+'&status='+status,
            success: function (json) {
                if(json == 1){
                    if(status == 1)
                        swal("", "已解封！", "success");
                    else
                        swal("", "已封号！", "success");
                }else{
                    swal("", "服务器异常！", "error");
                }
                if(show.totalRows!=0) {
                    fetchData("${pageContext.request.contextPath}/admin/customer/getCustomerList.action?p="+show.currentPage);
                }
            }
        });
    }
</script>

</body>
</html>


